<template>
	<view class="aclist">
		<view class="items" v-for="(item,index) in list" :key="index">
			<image :src="item.url" class="items_i"></image>
			<view class="items_z"><text class="t-icon t-icon-remenhuodong"></text>{{ item.title }}</view>
			<view class="items_ar">
				<view class="ar_a"><text class="t-icon t-icon-dizhi"></text>{{ item.location }}</view>
				<!-- <view class="ar_a"><uni-icons type="staff-filled" size="20"></uni-icons>{{ item.name }}</view> -->
			</view>
			<view class="items_ti">
				<text style="padding-right: 10rpx;">{{item.beginTime}}</text>至<text
					style="padding-left: 10rpx;">{{item.endTime}}</text>
			</view>
			<view class="items_c">{{ item.content }}</view>
			<view class="items_cz">
				<button class="haibao" @click="GeneratePoster(item)">生成入场卷</button>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		getUserActivityList
	} from "@/proxy/activity/activity.api.js";
	export default {
		async onLoad(option) {
			await this.getUserActivityListData(option.number); // 获取活动列表
		},
		data() {
			return {
				list: []
			}
		},
		methods: {
			// 生成海报
			GeneratePoster(item){
				// 传递对象时将其转为 JSON 字符串
				let obj = { id: item.id, title: item.title, location: item.location, content: item.content, url: item.url, number: item.number, name: item.name, unit: item.unit };
				
				
				uni.navigateTo({
				  url: '/pagesActivity/activity/vouchers?data=' + encodeURIComponent(JSON.stringify(obj))
				});
			},
			async getUserActivityListData(number) {
				try {
					const result = await getUserActivityList({
						number:number
					});
					console.log("用户查询活动列表", result)
					if (result.code == 200) {
						this.list = result.data;
					} else {
						return this.$toast({
							title: result.data.msg,
						});
					}
				} catch (error) {
					console.error("请求失败", error);
					return this.$toast({
						title: "发起失败，请联系管理员！",
						icon: "error",
					});
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	page {}

	.aclist {
		padding: 20rpx;
		background-color: #2698fb;

		.items {
			overflow: hidden;
			border: 1px solid #e8e8e8;
			background-color: #fff;
			border-radius: 20rpx;
			margin-bottom: 20rpx;
			padding: 15rpx;

			.items_i {
				width: 100%;
				height: 300rpx;
			}

			.items_z {
				padding: 10rpx;
				// color: #fff;
				font-size: 32rpx;
				font-weight: bold;
				display: flex;
				align-items: center;
			}

			.items_ar {
				display: flex;
				justify-content: space-between;
				align-items: center;
				color: #575959;
				font-size: 28rpx;
				padding: 10rpx;

				.ar_a {
					display: flex;
					align-items: center;
				}
			}

			.items_ti {
				display: flex;
				align-items: center;
				color: #999999;
				font-size: 28rpx;
				padding: 10rpx;
			}

			.items_c {
				color: #333333;
				font-size: 30rpx;
				padding: 10rpx 10rpx 5rpx 10rpx;
				letter-spacing: 2rpx;
				overflow: hidden;
				text-overflow: ellipsis;
				display: -webkit-box;
				-webkit-line-clamp: 2;
				line-height: 1.5;
				/*显示文本行数*/
				-webkit-box-orient: vertical;
			}

			.items_cz {
				display: flex;
				// justify-content: space-between;
				align-items: center;
				margin: 20rpx 0 0;

				.haibao {
					width: 250rpx;
					height: 70rpx;
					line-height: 70rpx;
					background-image: linear-gradient(to right, #1984FD, #43A4F1);
					font-size: 30rpx;
					letter-spacing: 3px;
					color: #fff;
					// margin: 0;
				}
			}

		}

	}
</style>